//获取
var start = document.querySelector("#start");
var btnStart = document.querySelector("#btnStart");
var Audio = document.querySelector("audio");
var select =document.querySelector("#select");
var bg = document.querySelector("#background");
var bg1 = document.querySelector("#bg1");
var bg2 = document.querySelector("#bg2");
var bg3 = document.querySelector("#bg3");
var bg4 = document.querySelector("#bg4");
var bg5 = document.querySelector("#bg5");
var bg6 = document.querySelector("#bg6");
var smallmouth = document.querySelector("#smallmouth");

/****** 预加载（图片） *****/
//创建新对象
var queue = new createjs.LoadQueue();
var queue2= new createjs.LoadQueue();
//监听进度
queue.on("progress",function(e){
	//获取
	var p = Math.floor(e.progress*100)+"%";
	progress.innerText = `loading ${p}`;
},this);
//监听完成
queue.on("complete",function(){
	console.log("加载完成")
	//隐藏loading页  显示start页
	loading.style.display="none";
	start.style.display="block";
},this);

//加载资源列表
var arr=[],arrSong=[];
var result =new Promise(step1).then(function(res){
	for(let i=0;i<res.length;i++){
		arr.push(res[i])
		arrSong.push(res[i].audio)
	}
});
queue2.loadManifest(arrSong);
queue.loadManifest(
	[
    "./img/star.png",
    "./img/protagonist.png",
    "./img/arrow.png",
    "./img/earth.png", 
    "./img/pleaseWearEar.png", 
//  "./img/tiaoGuo.png",
    "./img/KuGouLog.png",
    "./img/index_625secguess.png", 
    "./img/mouth.png", 
    "./img/whatSong.png", 
    "./img/sixQuery.png", 
    "./img/man_left.png", 
    "./img/man_right.png", 
    "./img/what.png",
    "./img/index_start.png",
    "./img/movieHitSong.png", 
    "./img/movieHitSongpeople.png", 
    "./img/movieHitSongCityWall.png",
    "./img/touxinag.png", 
    "./img/KuGouLog.png", 
    "./img/huangjing.png", 
    "./img/paiming_title.png",
//  "./img/index_bg.jpg",
    "./img/selectA.png",
    "./img/selectB.png",
    "./img/selectC.png",
    "./img/smallMouth.png",
//  "./img/nextOne.png",
    "./img/user_bg.png",
    "./img/userint.png",
    "./img/info.png",
    "./img/text.png",
    "./img/buttonright.png",
    "./img/paiming_bg.png"
  ]
)

/****** ajax（加载music） *******/
var i=0,correct=0, worry=0 ;
//ajax
function step1(resolve){
	$.ajax({
		url:"music.json",
		success(res){
			//传出数据
			resolve (res);
		},
	});
}
//渲染页面函数
function random(res){
	//随机数
	i = Math.ceil(Math.random()*50);
	console.log("随机数",i)
	var song = res[i].audio;
	var A=res[i].item[0];
	var B=res[i].item[1];
	var C=res[i].item[2];
	
	Audio.src= `${song}`;
	
	selectA.innerText = A;
	selectB.innerText = B;
	selectC.innerText = C;
	console.log("歌曲",song);
	console.log("答案",res[i].answer);
}
//判断
function step2(res){
	//点击selectABC
	selectA.addEventListener("click",panduan);
	selectB.addEventListener("click",panduan);
	selectC.addEventListener("click",panduan);
	function panduan(){
		console.log($('.answer').index(this));
		var condition  = $('.answer').index(this)== res[i].answer;
		if(condition){
			//正确切换下一首
			random(res);
			//分数累计
			correct++;
			console.log("正确&分数",correct);
		}else{
			//错两次下一首
			worry++;
			if(worry>=2){
				random(res);
				//初始化worry的值
				worry = 0;
			}
			console.log("错误",worry);
			listen.style.animation = "moreTime 2s";
		}
	}
}
//动画结束时初始化状态
listen.addEventListener("animationend",function(){
	listen.style.animation = "none";
})

//点击start按钮  隐藏页面
btnStart.addEventListener("click",function(){
	console.log("点击start")
	//隐藏start页面
	start.style.display = "none";
	//显示select模块 & bg模块
	select.style.display = "block";
	bg.style.display = "block";
	Audio.play();
	//启动定时器 & 游戏功能
	random(arr);
	step2(arr);
	bgTime();
	console.log("arr",arr)
})

//点击again&share
again.addEventListener("click",function(){
	correct = 0;
	over.style.display = "none";
	start.style.display = "block";
})
friend.addEventListener("click",function(){
	share.style.display = "block";
})
//点击share
share.addEventListener("click",function(){
	share.style.display = "none";
})

//smallmouth定时器
var time = 60;
function bgTime(){
	t = setInterval(function(){
		//time递减
		time--;
		smallmouth.innerText=`${time}s`;
		if(time<=50){
            bg1.style.animation = "change 1s forwards"
			bg2.style.left = "0%";
		}
		if(time<=40){
			bg2.style.animation = "change 1s forwards"
			bg3.style.left = "0%";
		}
		if(time<=30){
			smallmouth.style.animation = "Bmouth 1s infinite";
			bg3.style.animation = "change 1s forwards"
			bg4.style.left = "0%";
		}
		if(time<=20){
			bg4.style.animation = "change 1s forwards"
			bg5.style.left = "0%";
		}
		if(time<=10){
			bg5.style.animation = "change 1s forwards"
			bg6.style.left = "0%";
		}
		if(time<=0){
			//清除定时器
			clearInterval(t);
			//暂停歌曲
			Audio.pause();
			//显示分数
			score.innerText=`猜中 ${correct} 首`
			//隐藏 select模块 & bg模块， 显示over模块
			select.style.display ="none";
	        bg.style.display = "none";
	        over.style.display = "block";
			//初始化
			init()
		}
	},1000)
}
//初始化
function init(){
	time = 60 ;
	smallmouth.innerText = "60s"
	smallmouth.style.animation="none";
	bg1.style.display = "block";
	bg1.style.animation="none";
	bg2.style.display = "block";
	bg2.style.animation="none";
	bg2.style.left = "100%";
	bg3.style.display = "block";
	bg3.style.animation="none";
	bg3.style.left = "100%";
	bg4.style.display = "block";
	bg4.style.animation="none";
	bg4.style.left = "100%";
	bg5.style.display = "block";
	bg5.style.animation="none";
	bg5.style.left = "100%";
	bg6.style.left = "100%";
}

function change(){
	this.style.display="none";
}
